<template>
  <el-card>
    <template #header>
      <TodoHeader></TodoHeader>
    </template>
    <TodoList></TodoList>
    <template #footer>
      <TodoFooter></TodoFooter>
    </template>
  </el-card>
</template>

<script setup lang="ts">
import TodoHeader from './components/TodoHeader.vue'
import TodoList from './components/TodoList.vue'
import TodoFooter from './components/TodoFooter.vue'

import { useProvideTodoCtx } from './useTodo'

useProvideTodoCtx()
</script>
